<template>
  <img v-for="item in dogList" :key="item.id" :src="item" alt="失败">
</template>

<script lang="ts">
  /**
   * @Author Rin_pu
   * @Date 2025/2/19 09:11
   * @Description My2
   * @todo
   */
  export default {
    name: "My2"
  }
</script>

<script setup lang="ts">
import {onMounted, reactive} from "vue";
  import axios from "axios";


  const dogList = reactive<Array<string>>([]);

  async function addDog() {
    try {
      const result = await axios.get('https://dog.ceo/api/breed/pembroke/images/random');
      dogList.push(result.data.message);
    } catch (err) {
      alert(err);
    }
  }

  onMounted(() => {
    addDog();
    addDog();
    addDog();
  })
</script>

<style scoped>

</style>